import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
import path from 'path';
import vueDevTools from 'vite-plugin-vue-devtools'
import { fileURLToPath, URL } from "node:url";
import {viteMockServe} from 'vite-plugin-mock'
import fs from 'node:fs';
import tailwindcss from '@tailwindcss/vite'
// 扩展 ViteMockOptions 类型
declare module 'vite-plugin-mock' {
  interface ViteMockOptions {
    localEnabled?: boolean;
  }
}
export default defineConfig(({command})=>{
  return {
    plugins: [
      tailwindcss(),
      vue(),
      vueDevTools(),
      // 配置 svg 插件
      createSvgIconsPlugin({
        iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
        symbolId: 'icon-[dir]-[name]',
      }) as any, // 使用 as any 来暂时绕过类型检查
    // 配置 mock 插件
    viteMockServe({
      localEnabled: command === 'serve', // 保证开发阶段可以使用mock接口
    })
    ],
    resolve:{
      alias: {
        '@': path.resolve(__dirname, 'src'),
      },
    },
    server: {
      open: true,
      port: 5173,
      host: '0.0.0.0',
      // 这里必要用ssl证书，https访问项目
      https: {
        key: fs.readFileSync('cert/server.key'),
        cert: fs.readFileSync('cert/server.pem'),
      },
      proxy: {
        '/api': {
          target: 'http://127.0.0.1:9090',
          changeOrigin: true,
          ws: true, // 开启websocket代理
        },
      },
    },
    //  //scss全局变量一个配置
    //  css: {
    //   preprocessorOptions: {
    //     scss: {
    //       javascriptEnabled: true,
    //       additionalData: '@import "./src/styles/variable.scss";',
    //     },
    //   },
    // },
  }
});